<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>点击事件</title>
	<style type="text/css">
        #box{
         	width:200px;height:200px;background: red;
        }

        #broder{
         	width:200px;height:200px;background: blue;

        }

	</style>
    <script type="text/javascript">
       window.onload = function(){
	       var oBox = document.getElementById('box');
	       // 加点击事件，点击弹出777
	        x=0; //一定要写在外面
	        oBox.onclick = function(){
	    	//点击box    broder消失
	    	// broder.style.display = 'none';
	    	// 点击box  none变成block,   block变成none	    	
	    	if(x==0){
	    		//声明一个变量data   在broder消失之前把内容取出来放进box里面
	    		data = broder.innerHTML;  //提出内容  innerHTML
                oBox.innerHTML = data;
                broder.style.display = 'none';
	    		x=1;
	    	}else{
	    		oBox.innerHTML = "";
	    		broder.style.display = 'block';
	    		x=0;
	    	}
    }


        //抓取第二个盒子
        var broder = document.getElementById('broder');

        }
       


    </script>


</head>
<body>

    <div id="box">
    	

    </div>

    <div id="broder">
    	
    	我爱中国共产党

    </div>


    <script type="text/javascript">
    //     var oBox = document.getElementById('box');
    //     // 加点击事件，点击弹出777
    //     oBox.onclick = function(){
    //     	//点击box    broder消失
    //     	// broder.style.display = 'none';
    //     	// 点击box  none变成block,   block变成none
    //     	if( broder.style.display == 'none'){

    //     		broder.style.display = 'block';
    //     	}else{
    //     		broder.style.display = 'none';
    //     	}
    //     }


    //     //抓取第二个盒子
    //     var broder = document.getElementById('broder');


    // </script>
	
</body>
</html>